<template>
  <view>
    <view v-if="type == 1" class="payBOx">
      <view class="payTop">
        <img alt=""
             class="payImg"
             src="https://hzdaoziji.oss-cn-hangzhou.aliyuncs.com/file177f2a286d9441699dbd919864c5cd2b.png">
        <view class="payTitle">
          支付成功
        </view>
      </view>
      <view class="payText">
        可在个人中心-商品订单中管理您购买的商品
      </view>
      <view class="payBotton" style="background: #f59a23;"
            @click="toUrl(1,'/subpackageOne/venueRelated/commodityOrder/commodityOrder')">
        商品订单
      </view>
      <view class="payBotton" @click="toUrl(2,'/pages/home/index')">
        返回首页
      </view>
    </view>
    <view v-if="type == 2" class="payBOx">
      <view class="payTop">
        <img alt=""
             class="payImg"
             src="https://hzdaoziji.oss-cn-hangzhou.aliyuncs.com/file2d8d9574d7c544b2867ab65d7f1cf490.png">
        <view class="payTitle">
          取消支付
        </view>
      </view>
      <view class="payText">
        可在商品订单列表继续完成支付
      </view>
      <view class="payBotton" style="background: #f59a23;"
            @click="toUrl(1,'/subpackageOne/venueRelated/commodityOrder/commodityOrder')">
        商品订单
      </view>
      <view class="payBotton" @click="toUrl(2,'/pages/home/index')">
        返回首页
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      type: 1
    }
  },
  onLoad(data) {
    console.log(data);
    this.type = data.type

  },
  methods: {
    toUrl(data, url) {
      if (data == 2) {
        uni.switchTab({
          url
        });
      } else {
        uni.navigateTo({
          url
        })
      }

    }
  }
}
</script>

<style lang="scss" scoped>
.payBOx {
  width: 400rpx;
  margin: auto;

  .payTop {
    margin-top: 100px;
    display: flex;
    justify-content: center;

    .payImg {
      width: 90rpx;
      height: 90rpx;
    }

    .payTitle {
      font-size: 60rpx;
      font-weight: 600;
      margin-left: 30rpx;
    }
  }

  .payText {
    font-size: 34rpx;
    font-weight: 600;
    margin: 100rpx 0;
  }

  .payBotton {
    margin: 40rpx 0;
    padding: 20rpx 0;
    border-radius: 16rpx;
    text-align: center;
    color: #fff;
    background-color: #169bd5;
  }
}
</style>
